<!--
 * @Descripttion: damage报损报溢新增
 * @version:
 * @Author: cxguo
 * @Date: 2019-08-17 20:26:23
 * @LastEditors: cxguo
 * @LastEditTime: 2020-11-11 20:23:38
 -->
<template>
  <div>
    <el-form
      ref="form"
      :model="dataObj"
      :rules="rules"
      label-position="right"
      label-width="100px"
      size="mini"
    >
      <el-form-item :label="`账户名称:`" prop="name">
        <el-input v-model="dataObj.name" class="w400" />
        <el-checkbox v-model="dataObj.isDefault" true-label="1" false-label="0" border>设为默认</el-checkbox>
      </el-form-item>
      <el-form-item :label="`开户银行:`">
        <el-input v-model="dataObj.bankName" class="w400" />
      </el-form-item>
      <el-form-item label="银行账号:">
        <el-input v-model="dataObj.account" class="w400" />
      </el-form-item>
      <el-form-item label="期初余额:">
        <el-input-number v-model="dataObj.originAmount" :min="0" />
      </el-form-item>
      <el-form-item label="备注:">
        <el-input v-model="dataObj.remark" class="w400" type="textarea" />
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import { oftenuse } from '@/libs/mixins'
import { isTelOrPhone } from '@/utils/validate'
import clonedeep from 'clonedeep'

export default {
  name: 'StoreSave',
  mixins: [oftenuse],
  props: {
    operation: {
      type: String,
      default: 'add',
      validator: (value) => {
        return ['add', 'update'].indexOf(value) !== -1
      }
    },
    data: {
      type: Object,
      default: () => { return {} }
    }
  },
  data() {
    return {
      dataObj: {},
      optionsData: {},
      rules: {
        name: [
          { required: true, message: '请填写账户名称！', trigger: 'blur' }
        ],
        account: [
          { validator: isTelOrPhone, trigger: 'blur' }
        ]
      }
    }
  },
  computed: {
  },
  watch: {
  },
  created() {
    this.initData()
  },
  methods: {
    valiData() {
      return this.handleValid('form')
    },
    getData() {
      const data = this.dataObj
      return { data }
    },
    initData() {
      if (this.operation === 'update') this.initUpdateData()
    },
    initUpdateData() {
      this.dataObj = clonedeep(this.data)
    }
  }
}
</script>

<style scoped>
.el-divider--horizontal{
  margin: 5px 0;
}
</style>
